@charset 'UTF-8';
@import './base/variables.scss';
@import './main/index.scss';
@import './main/student.scss';
@import './main/recruit.scss';
@import './main/admin.scss';
@import './main/recruit.scss';
@import './main/manage.scss';
.page-container {
	margin: 10px;
}
/* header */
.header {
	a {
		color: $white;
	}
	.navbar-brand {
		width: 174px;
		height: 50px;
		padding: 0 15px 0 0;
		position: relative;
		img {
			position: absolute;
			top: 0;
			left: 0;
		}
	}
	.navbar-nav>li {
		float: left;
		a {
			background-color: $green;
			&:hover {
				background-color: darken($green, 10%) !important;
			}
		}
	}
	// topbar
	.topbar {
		padding: 10px 0;
		.btn-group {
			position: relative;
			&.open {
				.dropdown-menu-v2 {
					display: block;
				}
			}
		}
	}
	.dropdown-menu-v2 {
		top: 100%;
	    right: 0;
	    z-index: 1001;
	    display: none;
	    min-width: 225px;
	    padding: 20px 0;
	    margin-top: 10px;
	    font-size: 13px;
	    text-align: left;
	    position: absolute;
	    background: #242b31;
	    border-radius: 2px;
	    background-clip: padding-box;
	    transition-duration: .3s;
	    transition-property: all;
	    transition-timing-function: cubic-bezier(.7, 1, .7, 1);
	    &:before {
	    	top: -10px;
		    right: 0;
		    width: 0;
		    height: 0;
		    content: ' ';
		    position: absolute;
		    border-style: solid;
		    display: inline-block;
		    border-width: 0 0 15px 15px;
		    border-color: transparent transparent #242b31;
	    }
		a {
			color: #606e7a;
		    display: block;
		    font-weight: 600;
		    padding: 8px 20px;
		    position: relative;
		    white-space: nowrap;
		    line-height: 1.42857143;
		    text-transform: none !important;
		    &:hover,
		    &:focus {
		    	background: #21282e;
			    text-decoration: none;
			    color: #009dc7;
		    }
		}
	}
	.btn-bell {
		background: $blue;
		color: $white;
	    width: 35px;
	    height: 35px;
	    position: relative;
	    .badge {
	    	top: -10px;
		    right: -10px;
		    height: 21px;
		    color: #62717f;
		    min-width: 21px;
		    font-weight: 700;
		    line-height: 1.4;
		    position: absolute;
		    border: 2px solid #2f373e;
		    font-size: 9px!important;
		    background: #fff;
	    }
	}

	.btn-group-second {
		margin: 0 30px 0 15px;
	}
	.btn-qrcode {
	    position: relative;
	    background: $red;
	    color: #fff;
	    width: 35px;
	    height: 35px;
	}
	.btn-head {
		position: relative;
	    line-height: normal;
	    background: #333c43;
	    padding: 0 0 0 10px;
	    &>span {
	    	padding: 9px;
		    display: inline-block;
		    vertical-align: middle;
		    color: #009dc7;
		    text-transform: uppercase;
	    }
	    &>img {
	    	margin-top: -1px;
		    text-align: center;
		    vertical-align: middle;
		    border-radius: 2px;
		    background-clip: padding-box;
		    height: 35px;
	    }
	}
} 
/*main*/ 
.dark-body {
	// background-color: #34495e;
	background-color: #2f373e;
}
.main-container {
	margin: 0;
	padding: 30px 0;
}
.main-wrapper {
	background-color: #f9f9f9;
	.btn-row {
		a {
			color: $white;
		}
	}
}
.table {
	background-color: $white;
}
.nav-list {
	overflow: hidden;
	.nav-list-item {
		background-color: $blue;
		color: $white !important;
		&:hover {
			background-color: darken($blue, 5%);
			a {
				background-color: darken($blue, 5%); 
			}
		}
		&:active {
			background-color: darken($blue, 5%);
			a {
				background-color: darken($blue, 5%); 
			}
		}
		&.active {
			background-color: darken($blue, 10%);
			a {
				background-color: darken($blue, 10%); 
			}
		}
		a {
			color: $white !important;
			i {
				margin-right: 5px;
			}
		}
	}
}
.wrapper {
	padding-bottom: 10px;
	.wrapper-content {
		.content-title {
			margin: 0 0 10px 0;
		    font-size: 22px;
		    font-weight: 500;
		    line-height: 1.4;
		    color: #2a3239;
		}
		.content-item  {
			box-sizing: border-box;
			margin-bottom: 15px;
			.content-head {
				padding: 0;
	    		min-height: 40px;
				border-bottom: 1px solid $borderColor;
			    margin-bottom: 10px;
			    border-radius: 4px 4px 0 0;
			    color: #9eacb4;
			    font-size: 13px;
			    line-height: 18px;
			    span {
			    	font-size: 16px;
			    	font-weight: blod;
			    	margin-right: 5px;
			    	i {
			    		margin-right: 5px;
			    	}
			    }
			}
			.echart {
				width: 100%;
				min-height: 400px;
			}
		}
	}
}
.second-nav {
	overflow: hidden;
	&-item {
		display: inline-block;
		a {
			color: #6c7b88;
		    font-size: 14px;
		    font-weight: 500;
		    text-decoration: none;
		    padding: 20px 15px 20px 30px;
		    font-family: "Open Sans",sans-serif;
			display: block;
			i {
				margin-right: 5px;
			}
			&:hover {
				background: inherit;
	    		color: $blue;
			}
		}
		&.active {
			a {
				color: darken($blue, 10%) !important;
			}
		}
	}
}
.btn-row {
	border-bottom: 1px solid $borderColor;
	margin-bottom: 15px;
	padding-bottom: 15px;
}

.header-nav {
	.open>a, 
	.open>a:focus,
	.open>a:hover {
		background-color: $blue;
	}
	.first-nav-item {
		background-color: $blue;
		color: $white !important;
		&>a {
			color: $white;
			&:hover {
				background-color: darken($blue, 5%);
			}
			&:active {
				background-color: darken($blue, 5%);
			}
			&:focus {
				background-color: darken($blue, 5%);
			}
			&.active {
				background-color: darken($blue, 10%);
			}
		}

		.dropdown-menu {
			background-color: $white;
		}
	}
	.second-nav-item {
		a.active {
			color: darken($blue, 10%) !important;
		}
	}
}
// form
.form-header {
	border-bottom: 1px solid #e5e5e5;
	padding-bottom: 10px;
	.form-title {
		font-size: 20px;
	}
	.fa-chevron-down {
		font-size: 20px;
		transition: all .5s ease;
		&.active {
			transform: rotate(180deg);
		}
	}
}